টেক্সট ফরমেট

এই টেক্সটগুলোকে স্টাইল করার জন্য কিছু টেক্সট ফরম্যাট প্রোপার্টি ব্যবহার করা হয়েছে। হেডিং-এ text-align, text-transform এবং color প্রোপার্টি ব্যবহার করা হয়েছে। প্যারাগ্রাফে ইনডেন্ট এলাইন এবং ক্যারেক্টার স্পেসিং নির্দিষ্ট করে দেয়া হয়েছে।

এক নজরে সিএসএস টেক্সট প্রোপার্টিসমূহ

color

টেক্সটের কালার সেট করার জন্য ব্যবহার করা হয়।

direction

টেক্সটের ডিরেকশন সেট করার জন্য ব্যবহার করা হয়।

letter-spacing

শব্দের মধ্যে দুটি অক্ষরের মধ্যবর্তী স্পেস বৃদ্ধি বা হ্রাস করার জন্য ব্যবহার করা হয়।

line-height

দুটি লাইনের মধ্যবর্তী উচ্চতা সেট করার জন্য ব্যবহার করা হয়।

text-align

টেক্সটের হরিজন্টাল এলাইনমেন্ট সেট করার জন্য ব্যবহার করা হয়।

text-decoration

টেক্সটকে সাজসজ্জা বা ডেকোরেটশন করার জন্য ব্যবহার করা হয়।

text-indent

একটি টেক্সট ব্লকের প্রথম লাইনটির ইন্ডেন্টেশন সেট করার জন্য ব্যবহার করা হয়।

text-shadow

টেক্সটের মধ্যে স্যাডো ইফেক্ট তৈরি করার জন্য ব্যবহার করা হয়।

text-transform

টেক্সট ক্যাপিটাইলেজশন নিয়ন্ত্রন করার জন্য ব্যবহার করা হয়।

unicode-bidi

direction প্রোপার্টির সাথে ব্যবহৃত হয়ে একই ডকুমেন্টের মধ্যে বিভিন্ন ভাষা সাপোর্ট করানোর জন্য। টেক্সট ওভাররাইড হবে কিনা তা সেট বা রিটার্ন করে।

vertical-align

এলিমেন্টের ভার্টিকাল এলাইনমেন্ট সেট করার জন্য ব্যবহার করা হয়।

white-space

এলিমেন্ট গুলোর মধ্যে কতগুলো হোয়াইট স্পেস নেওয়া হবে তা ঠিক করার জন্য ব্যবহার করা হয়।

word-spacing

বাক্যের মধ্যে দুটি শব্দের মধ্যবর্তী স্পেস বৃদ্ধি বা হ্রাস করার জন্য ব্যবহার করা হয়।

color প্রোপার্টি

টেক্সটকে বিভিন্ন কালার করার জন্য color প্রোপার্টি ব্যবহার করা হয়।

নিচের যেকোনো একটি পদ্ধতি ব্যবহার করে কালার সেট করা যায়ঃ

• name - কালারের নাম ব্যবহার করে, যেমন "green"
• Hex - হেক্সাডেসিমাল ভ্যালু ব্যবহার করে, যেমন "#00ff00"
• RGB - RGB ভ্যালু ব্যবহার করে, যেমন “rgb(0,255,0)”

কালার ভ্যালু সম্পর্কে সম্পূর্ণ ধারনা পাওয়ার জন্য আমাদের সিএসএস কালার ভ্যালু লিংক থেকে ঘুরে আসুন।

একটি পেজের ডিফল্ট টেক্সট কালার সেট করার জন্য body সিলেক্টর ব্যবহার করতে হয়।

নিচের উদাহরণে body সিলেক্টর দ্বারা একটি পেজের ডিফল্ট টেক্সট কালার blue সেট করা হলো। ফলে ডিফল্টভাবে এই পেজের টেক্সট কালার হবে blue।

kt_satt_skill_example_id=538

text-align প্রোপার্টি

text-align প্রোপার্টি ব্যবহার করে টেক্সটের আনুভূমিক(horizontal) এলাইনমেন্ট সেট করা হয়।

টেক্সটে left, right, centered অথবা justified এই চার ধরনের এলাইনমেন্ট ব্যবহার করা যায়।

নিচের উদাহরণে টেক্সট এর জন্য center, left এবং right এলাইন ব্যবহার করা হয়েছে। টেক্সট এর নির্দেশনা বাম থেকে ডানে হলে left এলাইনমেন্ট ডিফল্ট হবে এবং টেক্সট এর নির্দেশনা ডান থেকে বামে হলে right এলাইনমেন্ট ডিফল্ট হবে।

kt_satt_skill_example_id=544

যখন text-align প্রোপার্টির ভ্যালু "justify" সেট করা হয়, তখন প্রত্যেক লাইন বামে ও ডানে সমানভাবে প্রসারিত হয়। অনেকটা ম্যাগাজিন এবং পত্রিকার মত বামে ও ডানে মার্জিন নিয়ে নেয়।

kt_satt_skill_example_id=546

text-decoration প্রোপার্টি

টেক্সট ডেকোরেশন সেট করতে বা মুছে ফেলার জন্য text-decoration প্রোপার্টিটি ব্যবহার করা হয়।

টেক্সটের নিচের আন্ডারলাইন মুছে ফেলার জন্য text-decoration: none; ব্যবহার করা হয়।

kt_satt_skill_example_id=552

বিঃদ্রঃ সাধারণত হাইপারলিংক যুক্ত টেক্সট আন্ডারলাইন হয়। এই উদাহরণটিতে text-decoration: none; ব্যবহার করায় লিংকটিতে কোন আন্ডারলাইন হয়নি।

টেক্সট ডেকোরেশনের জন্য text-decoration-এ অন্যান্য যে ভ্যালু গুলো ব্যবহৃত হয়ঃ

kt_satt_skill_example_id=556

text-transform প্রোপার্টি

টেক্সটকে সাধারণত বড় এবং ছোট হাতের অক্ষরে উপস্থাপন করার জন্য text-transform প্রোপার্টিটি ব্যবহার করা হয়।

এটি সাধারণত বড় হাতের অক্ষর(uppercase)-কে ছোট হাতের অক্ষরে(lowercase) বা ছোট হাতের অক্ষরকে বড় হাতের অক্ষরে রুপান্তরিত করার জন্য অথবা শব্দের প্রথম বর্ণকে বড় হাতের অক্ষরে লেখার জন্য ব্যবহার করা হয়ঃ

kt_satt_skill_example_id=558

text-indent প্রোপার্টি

টেক্সটের প্রথম লাইনে ইনডেন্ট দেওয়ার জন্য text-indent প্রোপার্টি ব্যবহার করা হয়।

kt_satt_skill_example_id=561

letter-spacing প্রোপার্টি

টেক্সটের মধ্যে দুটি অক্ষরের মধ্যবর্তী দুরত্ব বাড়ানো বা কমানোর জন্য letter-spacing প্রোপার্টিটি ব্যবহার করা হয়।

নিচের উদাহরণে দেখানো হলো কিভাবে অক্ষরের স্পেস বাড়ানো বা কমানো যায়ঃ

kt_satt_skill_example_id=563

letter-spacing প্রোপার্টি

টেক্সটের মধ্যে দুটি অক্ষরের মধ্যবর্তী দুরত্ব বাড়ানো বা কমানোর জন্য letter-spacing প্রোপার্টিটি ব্যবহার করা হয়।

নিচের উদাহরণে দেখানো হলো কিভাবে অক্ষরের স্পেস বাড়ানো বা কমানো যায়ঃ

kt_satt_skill_example_id=568

direction প্রোপার্টি

একটি এলিমেন্টের টেক্সটের ডিরেকশন পরিবর্তন করার জন্য direction প্রোপার্টিটি ব্যবহার করা হয়।

kt_satt_skill_example_id=569

word-spacing প্রোপার্টি

বাক্যের মধ্যে দুটি শব্দের মধ্যবর্তী স্পেস বাড়ানো বা কমানোর জন্য word-spacing প্রোপার্টি ব্যবহার করা হয়।

নিচের উদাহরণের মাধ্যমে দেখানো হলো কিভাবে দুটি শব্দের মধ্যবর্তী স্পেস বাড়ানো বা কমানো যায়ঃ

kt_satt_skill_example_id=573